<template>
  <div class="home">
    <div class="top">
      <div>
        <input
          type="radio"
          id="purchase"
          value="2018032900295987"
          v-model="datatype"
        />
        采购
        <input
          type="radio"
          id="bid"
          value="2018032700291334"
          v-model="datatype"
        />
        招标
      </div>
      <div class="item">搜索内容:</div>
      <input class="item" v-model="searchContent" />
      <div class="item">页:</div>
      <input class="item page" v-model="pagenumber" />
      <div class="item">完成数量: {{ finished }}/{{ total }}</div>
      <button class="item start_btn" @click="start">开始</button>
      <button class="item start_btn" @click="clear">清空</button>
    </div>
    <div class="bottom">
      <textarea class="log" v-model="log" id="textarea_id"></textarea>
    </div>
  </div>
</template>

<script>
import util from "../util/index";

export default {
  name: "Home",
  data() {
    return {
      datatype: "2018032900295987",
      log: "",
      searchContent: "",
      pagenumber: 1,
      total: 0,
      finished: 0,
      index: 1,
    };
  },
  created() {
    const { ipcRenderer } = window.require("electron");
    ipcRenderer.on("downstate", (event, arg) => {
      console.log(event, arg);
      this.finished++;

      if (this.finished >= this.total) {
        console.log(">>>>>>>>>>>>>>>>>>> 开始解压 <<<<<<<<<<<<");
        ipcRenderer.send("unzip", "");
      }
    });
    ipcRenderer.on("unzipstate", (event, arg) => {
      console.log(event, arg);
      ipcRenderer.send("search", this.searchContent);
    });
    ipcRenderer.on("log", (event, arg) => {
      this.logMsg(arg);
      const textarea = document.getElementById("textarea_id");
      textarea.scrollTop = textarea.scrollHeight;
    });
  },
  methods: {
    start: function () {
      this.total = 0;
      this.finished = 0;
      this.index = 1;
      this.log = "";

      this.loadData();
    },
    loadData: function () {
      this.logMsg(`current page: ${this.index}  current type: ${this.datatype}`);
      const that = this;
      this.$axios({
        url: "https://ecp.sgcc.com.cn/ecp2.0/ecpwcmcore/index/noteList",
        method: "post",
        data: {
          index: this.index,
          size: 20,
          firstPageMenuId: this.datatype,
          purOrgStatus: "",
          purOrgCode: "",
          purType: "",
          orgId: "",
          key: "",
        },
      }).then((res) => {
        // that.download(res.data.resultValue.noteList[18].noticeId);
        res.data.resultValue.noteList.forEach(function (value) {
          that.download(value.noticeId);
        });

        // that.total = res.data.resultValue.count
        that.total = this.pagenumber * 20;

        if (this.total == 0 || this.index * 20 < this.total) {
          this.index++;
          this.loadData();
        }
      });
    },

    download: function (noticeId) {
      if (util.isNull(noticeId)) {
        console.log("null");
        return;
      }
      const baseUrl = `https://ecp.sgcc.com.cn/ecp2.0/ecpwcmcore//index/downLoadBid?noticeId=${noticeId}&noticeDetId=`;
      const { ipcRenderer } = window.require("electron");
      const fileUrl = `${baseUrl}`;
      this.logMsg(fileUrl);
      ipcRenderer.send("download", fileUrl);
    },
    clear: function () {
      const { ipcRenderer } = window.require("electron");
      ipcRenderer.send("clear", "");
    },
    logMsg: function (msg) {
      this.log = `${this.log} \n ${msg}`;
    },
  },
};
</script>
<style lang="less">
.top {
  display: flex;
  justify-content: left; //水平中对齐
  align-items: center; // 垂直中对齐
  height: 50px;
  margin-top: 50px;
  background-color: gray;
}

.item {
  margin-left: 30px;
}

.page {
  width: 30px;
}

.start_btn {
  width: 70px;
  height: 30px;
}

.bottom {
  height: 400px;
}

.log {
  height: 100%;
  width: 100%;
}
</style>
